function loadImage(idImage, urlImage) {
    $('#' + idImage).attr('src', urlImage);
}

function albumShuffle(idAlbum) {
    $('#' + idAlbum).removeClass("masquer");
    $('#' + idAlbum).cycle({
        fx: 'shuffle',
        shuffle: {
            top: -40,
            left: 150
        },
        easing: 'easeOutBack',
        delay: -4000
    });
}

function albumCurtainX(idAlbum) {
    $('#' + idAlbum).removeClass("masquer");
    $('#' + idAlbum).cycle({
        fx: 'curtainX',
        sync: false,
        delay: -2000
    });
}

(function ($) {
    stepIn = 90
    stepOut = 270;
    if ($.browser.webkit) {
        stepIn += 20;
        stepOut += 20;
    }
    $.fn.flipHover = function (perspective, duration) {
        $(this).hover(function () {
            $(this).flipBack(perspective, duration);
        }, function () {
            $(this).flipFront(perspective, duration);
        })
    };
    $.fn.flipBack = function (perspective, duration) {
        if (!$(this).hasClass('back')) {
            $(this).flip(new Array(stepIn, stepOut, 360), perspective, duration);
        }
    };
    $.fn.flipFront = function (perspective, duration) {
        if (!$(this).hasClass('front')) {
            $(this).flip(new Array(stepOut, stepIn, 0), perspective, duration);
        }
    };
    $.fn.flip = function (steps, perspective, duration) {
        if (!$(this).hasClass('inprogress')) {
            $(this).addClass("inprogress");
            if (steps[0] < steps[2]) {
                imgStart = $(this).find($('img:nth-child(1)'));
                imgEnd = $(this).find($('img:nth-child(2)'));
            }
            else {
                imgStart = $(this).find($('img:nth-child(2)'));
                imgEnd = $(this).find($('img:nth-child(1)'));
            }
            imgEnd.addClass("masquer");
            imgStart.removeClass("masquer");
            $(this).transition({
                perspective: perspective + 'px',
                rotateY: steps[0] + 'deg',
                duration: duration / 2,
                easing: 'in',
                complete: function () {
                    setTimeout(function () {
                        imgStart.addClass("masquer");
                        imgEnd.removeClass("masquer");
                    }, 0)
                    $(this).transition({
                        perspective: perspective + 'px',
                        rotateY: steps[1] + 'deg',
                        duration: 0,
                        complete: function () {
                            $(this).transition({
                                perspective: perspective + 'px',
                                rotateY: steps[2] + 'deg',
                                duration: duration / 2,
                                easing: 'in',
                                complete: function () {
                                    if (steps[0] < steps[2]) {
                                        $(this).removeClass("front");
                                        $(this).addClass("back");
                                    }
                                    else {
                                        $(this).removeClass("back");
                                        $(this).addClass("front");
                                    }
                                    $(this).removeClass("inprogress");
                                }
                            });
                        }
                    });
                }
            });
        }
    }
})(jQuery);
function formatText(index, panel) {
    return index + "";
}

function gallery() {
    // We only want these styles applied when javascript is enabled
    $('div.navigation').css({'width': '240px', 'float': 'left'});
    $('div.content').css('display', 'block');

    // Initially set opacity on thumbs and add
    // additional styling for hover effect on thumbs
    var onMouseOutOpacity = 0.67;
    $('#thumbs ul.thumbs li').opacityrollover({
        mouseOutOpacity: onMouseOutOpacity,
        mouseOverOpacity: 1.0,
        fadeSpeed: 'fast',
        exemptionSelector: '.selected'
    });

    // Initialize Advanced Galleriffic Gallery
    var gallery = $('#thumbs').galleriffic({
        delay: 2500,
        numThumbs: 10,
        preloadAhead: 10,
        enableTopPager: true,
        enableBottomPager: true,
        maxPagesToShow: 7,
        imageContainerSel: '#slideshow',
        controlsContainerSel: '#controls',
        captionContainerSel: '#caption',
        loadingContainerSel: '#loading',
        renderSSControls: true,
        renderNavControls: true,
        playLinkText: '',
        pauseLinkText: '',
        prevLinkText: '',
        nextLinkText: '',
        nextPageLinkText: '&rsaquo;',
        prevPageLinkText: '&lsaquo;',
        enableHistory: true,
        autoStart: false,
        syncTransitions: true,
        defaultTransitionDuration: 900,
        onSlideChange: function (prevIndex, nextIndex) {
            // 'this' refers to the gallery, which is an extension of $('#thumbs')
            this.find('ul.thumbs').children()
                .eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
                .eq(nextIndex).fadeTo('fast', 1.0);
        },
        onPageTransitionOut: function (callback) {
            this.fadeTo('fast', 0.0, callback);
        },
        onPageTransitionIn: function () {
            this.fadeTo('fast', 1.0);
        }
    });

    /**** Functions to support integration of galleriffic with the jquery.history plugin ****/

        // PageLoad function
        // This function is called when:
        // 1. after calling $.historyInit();
        // 2. after calling $.historyLoad();
        // 3. after pushing "Go Back" button of a browser
    function pageload(hash) {
        // alert("pageload: " + hash);
        // hash doesn't contain the first # character.
        if (hash) {
            $.galleriffic.gotoImage(hash);
        } else {
            gallery.gotoIndex(0);
        }
    }

    // Initialize history plugin.
    // The callback is called at once by present location.hash.
    $.historyInit(pageload, "advanced.html");

    // set onlick event for buttons using the jQuery 1.3 live method
    $("a[rel='history']").live('click', function (e) {
        if (e.button != 0) return true;

        var hash = this.href;
        hash = hash.replace(/^.*#/, '');

        // moves to a new page.
        // pageload is called at once.
        // hash don't contain "#", "?"
        $.historyLoad(hash);

        return false;
    });
}